<!DOCTYPE html>
<html style="height: 100%">

<head>
    <meta charset="utf-8">
</head>

<body style="height: 100%; margin: 0">
<div id="container" style="height: 100%"></div>
<script type="text/javascript" src="./echarts.min.js"></script>
<script type="text/javascript" src="./echarts-gl.min.js"></script>
<script type="text/javascript" src="./chalk.js"></script>

<script type="text/javascript" src="./ecStat.min.js"></script>
<script type="text/javascript" src="./dataTool.min.js"></script>
<script type="text/javascript" src="./china.js"></script>
<script type="text/javascript" src="./world.js"></script>
<!-- <script type="text/javascript" src="./api?v=2.0&ak=ZUONbpqGBsYGXNIYHicvbAbM"></script> -->
<!-- <script type="text/javascript" src="./bmap.min.js"></script> -->
<script type="text/javascript" src="./simplex.js"></script>
<script type="text/javascript">
        var dom = document.getElementById("container");
        var myChart = echarts.init(dom,'chalk');
        var app = {};

        var setting="";
        var setting=window.WcmData.getSetting();
        var setting=JSON.parse(setting);

        option = null;
        var xAxisData = setting.xAxisData;
        var series=[];
        for(var m=0;m<setting.legendDataNames.length;m++){
            series.push(
                {
                name: setting.legendDataNames[m],
                type: 'line',
                data: setting.datas[m],
                animationDelay: function (idx) {
                    return idx * 3;
                }
            });
        }

        option = {
            title: {
                text:setting.title //'水库水位曲线图'
            },
            legend: {
                data: setting.legendDataNames,//['上库水位', '下库水位'],
                align: 'left'
            },
            toolbox: {
                // y: 'bottom',
                feature: {
                    magicType: {
                        type: ['stack', 'tiled']
                    },
                    dataView: {},
                    // saveAsImage: {
                    //     pixelRatio: 2
                    // }
                }
            },
            tooltip: {},
            xAxis: {
                data: xAxisData,
                silent: false,
                splitLine: {
                    show: false
                }
            },
            yAxis: {
            },
            series: series,
            animationEasing: 'elasticOut',
            animationDelayUpdate: function (idx) {
                return idx * 5;
            }
        };
        if (option && typeof option === "object") {
            myChart.setOption(option, true);
        }

</script>
</body>

</html>